<template>
  <v-select
    v-bind="$attrs"
    v-model="currentValue"
    :items="data"
    :item-text="itemText"
    :item-value="itemValue"
    :loading="loading"
    v-on="$listeners"
  >   
  </v-select>
</template>

<script>
import request from '@/utils/request'
export default {
  name: 'DictSelect',
  props: {
    value: [String, Object, Number],
    api: {
      type: String,
      default: '/admin/system/datadict/listbytype'
    },
    type: {
      type: String,
      required: true
    },
    itemText: {
      type: String,
      default: 'value'
    },
    itemValue: {
      type: String,
      default: 'id'
    }
  },
  computed: {
    currentValue: {
      get() {
        return this.value
      },
      set(val) {
        this.$emit('input', val)
      }
    }
  },
  data() {
    return {
      loading: false,
      data: []
      // queryParams: {
      //   page: 1,
      //   limit: 10000
      // }
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      this.loading = true
      request({
        url: this.api,
        method: 'get',
        params: { type: this.type }
      }).then(res => {
        this.data = res.data
      }).finally(() => {
        this.loading = false
      })
    }
  }
}
</script>

<style>

</style>